<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/common/taglibs.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>自检--${fns:getConfig('productName')}</title>
<style type="text/css">
	.navigation li{
	 	vertical-align:middle;
	 	line-height: 28px;
		float:left;
		padding:0 6px;
		height:28px;
		background-color:#90CDD2;
		margin:0 2px;
		font-size:14px;
		text-align:center;
		color:#FFFFFF;
	}
	.navigation li a{
		color:#FFFFFF;
		cursor:pointer;
		display:block;
	}
	table{
		margin:0 auto;
	    width:98%;
	    text-align: center;
	    font-size:14px;
	}
	table tr:nth-child(1){
		font-size:14px;
		font-weight:600;
	}
	table tr td:nth-last-child(1){
		color:red;
	}
	table tr:nth-child(1) td:nth-last-child(1){
		color:black;
	}
	.navigation li.active{
		background-color:#00AAB7;
	}
	#datashow td{height:30px;}
	
	#zt .title{
		text-align:center;
		font-size: 14px;
		font-weight:bold;
		line-height: 40px;
	}
	#zt .text{
		    margin-left: 146%;
		    margin-top: 7px;
		    width: 100%;
		    font-size: 14px;
	}
	#zt .navigation li.active{
		background-color:#00AAB7;
	}
	#zt table{
		    width: 50%;
		    margin-left: 295px;
		    margin-top: 20px;
		    text-align: center;
		    font-size: 14px;
	}
	#zt table tr:nth-of-type(1){
		background-color:#E4E4E4;
		font-size: 14px;
	}
	#zt table tr td:nth-child(1){
		font-size: 14px;
	}
	#zt table tr td{height:45px;}
</style>
</head>
<body>
<div>
	<tags:message content="${msg}" />
	<ul class="navigation">
		<div id="tab"></div>
	</ul>
</div><div style="clear:both;"></div>
<div id= "dataTable"></div>
<div id="data_count" style="overflow:auto;padding-top: 15px;background-color:rgb(243, 251, 252);" ;>
<div id="datashow"></div>
</div>
<script>
	
	var lpk = null;
	$.ajax({  
	        url: '${ctx}/check/result.do?projectId=${fns:encodeParamUrl(projectId)}',
	        type: 'POST',
	        dataType: 'json',  
	        beforeSend:function(){
	        	$("#datashow").html("加载中...");
	        },
	        success: function(result){
	        	console.log(result);
	        	lpk = result;
	        	//li标签填充
	        	var tab="";
	        	tab+='<li><a data-lpk="zt" onclick=kk(lpk,this)>总体</a></li>';
	        	for(var i=0;i<result.length-1;i++){//lpk1 = temp;
	        		tab+='<li><a data-lpk="a" onclick=pandList("'+result[i].id+'",this)>'+result[i].name+'</a></li>';
	        	}
	        	$('#tab').append(tab);
	        	//default
	        	kk(lpk,$('#tab a')[0]);
	        }
	 });
	//切换tab获取不同表格
	function kk(result,lpk1){
		//祛除其他选中
		var children = lpk1.parentNode.parentNode.children;
		for(var i = 0;i<children.length;i++){
			if(children[i]!=lpk1.parentNode){
				$(children[i]).removeClass('active');
			}
		}
		lpk1.parentNode.className='active';
		$("#datashow").html("");//清空表格
		var apphtml="";
		apphtml += '<div id="zt"><div style="background-color:rgb(243, 251, 252);height: 93%;"><div class="title"><span style="font-family:"Arial Normal", "Arial";font-weight:400;">“${checkProject.projectName}”资料总完善度：</span><span style="color:brown;">'+result[result.length-1].perfection+'%</span></div><div style="clear:both;"></div>'+
				   '<div style="visibility: visible; left: 0px; width: 203px; transform-origin: 101.5px 11px 0px;"><p class="text">其它各分类完善度明细：</p></div><div><table border="1px"><tr><td>序号</td><td>分类</td><td>完善度</td></tr>';
		for(var i=0 ; i<result.length-1 ; i++){
			apphtml += "<tr><td>"+parseInt(i+1)+"</td><td>"+result[i].name+"</td><td style='color:black'>"+result[i].perfection+"%</td></tr>";
		}
		apphtml += "</table></div></div></div>";
		$('#datashow').append(apphtml);
	}
	
	function pandList(menuId,lpk1){
		var url = "${ctx}/self/menuList.do?projectId=${fns:encodeParamUrl(projectId)}&menuId="+menuId;
		$.ajax({  
	        url: url,
	        type: 'POST',
	        dataType: 'json',  
	        success: function(result){
	        	console.log(result);
	        	//祛除其他选中
	    		var children = lpk1.parentNode.parentNode.children;
	    		for(var i = 0;i<children.length;i++){
	    			if(children[i]!=lpk1.parentNode){
	    				$(children[i]).removeClass('active');
	    			}
	    		}
	    		lpk1.parentNode.className='active';
	        	$("#datashow").html("");//清空表格
	        	var menus = result[0].menuList;
	        	var data = result[0].result;
	        	var over = result[0].overList;
	        	//判断是否存在三级菜单
	        	var flag = true;
	        	for (var i=0; i<menus.length; i++){
	        		if (menus[i].parentId != menuId) {
	        			flag = false;
	        		}
	        	}
	        	if (flag) {
	        		var apphtml ="<table border='1px'><tr><td>检查项目</td><td>满分</td><td>系统评分</td><td>系统完善度</td></tr>";
					for(var i=0; i<menus.length; i++){
						if (i < data.length){
							apphtml += '<tr><td>'+menus[i].name+'</td>';
							if (data[i].tableFull == null) {
								apphtml += '<td>0</td>';
							}else {
								apphtml += '<td>'+data[i].tableFull+'</td>';
							}
							
							if (data[i].testFull == null) {
								apphtml += '<td>0</td>';
							}else {
								apphtml += '<td>'+data[i].testFull+'</td>';
							}
							
							if (data[i].perfection == null) {
								apphtml += '<td style="color:black">0%</td>';
							}else {
								apphtml += '<td style="color:black">'+data[i].perfection+'%</td>';
							}
							apphtml += '</tr>';
						} else {
							apphtml += '<tr><td>'+menus[i].name+'</td><td>0</td><td>0</td><td style="color:black">0%</td></tr>';
						}
					}
	        	} else {
	        		var apphtml ="<table border='1px'><tr><td>检查项目</td><td>表格简称</td><td>满分</td><td>系统评分</td><td>系统完善度</td></tr>";
	        		for (var i=0; i<over.length; i++){
	        			var temp=0;
	        			//获取每个二级菜单的三级菜单数量
	        			for (var j=0; j<menus.length; j++){
	        				if (over[i].id == menus[j].parentId){
	        					temp ++;
	        				}
	        			}
	        			//填充菜单名称
	        			var a =0;
	        			for (var j=0; j<menus.length; j++){
	        				if (over[i].id == menus[j].parentId){
	        					if (a == 0) {
	        						apphtml += '<tr><td rowspan="'+temp+'">'+over[i].name+'</td><td>'+menus[j].name+'</td>';
	        					} else {
	        						apphtml += '<tr><td>'+menus[j].name+'</td>';
	        					}
	        					//填充得分，完善度
	        					var isHave = false;
	        					for (var w=0; w<data.length; w++) {
        							if (menus[j].id == data[w].id) {
        								isHave = true;
        								if (data[w].tableFull == null) {
        									apphtml += '<td>0</td>';
        								}else {
        									apphtml += '<td>'+data[w].tableFull+'</td>';
        								}
        								
        								if (data[w].testFull == null) {
        									apphtml += '<td>0</td>';
        								}else {
        									apphtml += '<td>'+data[w].testFull+'</td>';
        								}
        								
        								if (data[w].perfection == null) {
        									apphtml += '<td style="color:black">0%</td>';
        								}else {
        									apphtml += '<td style="color:black">'+data[w].perfection+'%</td>';
        								}
        								apphtml += '</tr>';
        							} 
        						}
	        					if (!isHave){
	        						apphtml += '<td>0</td><td>0</td><td style="color:black">0%</td></tr>';
	        					}
		        				a ++;
	        				}
	        			}
	        		}
	        		
	        	}
				apphtml+="</table>";
				$('#datashow').append(apphtml);
	        }
	 	});
	}
	
$(".span10").css({"width":($(window).width()-237)+"px","margin":"0 0 0 2px","background":"rgb(243, 251, 252)"});
</script>
</body>
</html>